<template>
  <div id="body">
        <!-- 试卷 -->
    <div class="layout" >
        <h2>请选择考试</h2>
        <hr>
          选择考试
        <el-select v-model="value" placeholder="请选择" id="select-paper">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
        </el-select>
    </div>
    <div class="layout">
      <h2>试卷</h2>
      <hr>
        <h3>注意</h3>

      <el-input
        type="textarea"
        :autosize="{ minRows: 2, maxRows: 4}"
        placeholder="请输入内容"
        v-model="textarea2">
      </el-input>

      <hr>
        <h3>样例1</h3>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2, maxRows: 4}"
        placeholder="请输入内容"
        v-model="textarea2">
      </el-input>
         <hr>
        <h3>样例2</h3>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2, maxRows: 4}"
        placeholder="请输入内容"
        v-model="textarea2">
      </el-input>
         <hr>
        <h3>样例3</h3>
      <el-input
        type="textarea"
        :autosize="{ minRows: 2, maxRows: 4}"
        placeholder="请输入内容"
        v-model="textarea2">
      </el-input>
    </div>

    <el-row>
      <el-button class="button">输入题目</el-button>
      <el-button class="button">输入答案</el-button>
      <el-button class="button">删除一道题</el-button>
      <el-button class="button">重置</el-button>
      <el-button class="button">确认添加试卷</el-button>
    </el-row>
      <el-main>
      <el-table :data="tableData">
        <el-table-column prop="date" label="题号" width="140">
        </el-table-column>
        <el-table-column prop="name" label="答案" width="120">
        </el-table-column>
        <el-table-column prop="name" label="题目" width="120">
        </el-table-column>
        <el-table-column prop="address" label="选项">
        </el-table-column>
      </el-table>
    </el-main>

  </div>
</template>
<script>
export default {
  data () {
    return {
      options: [{
        value: '选项1',
        label: '黄金糕'
      }, {
        value: '选项2',
        label: '双皮奶'
      }, {
        value: '选项3',
        label: '蚵仔煎'
      }, {
        value: '选项4',
        label: '龙须面'
      }, {
        value: '选项5',
        label: '北京烤鸭'
      }],
      value: '',
      textarea: ''
    }
  }
}
</script>
<style>
#body{
    width: 1000px;
    position: relative;
    margin-left: 300px;
}
#select-paper{
position: relative;
size: medium;
}
.layout{
  margin: 30px;
  border-style: solid;
  border-width: 1px;
  padding: 10px;
}
.button{
  margin-left: 50px;
  margin-right: 50px;
}

</style>
